﻿<div>
    <div id='valuePlaceHolder'></div>

    <script type="text/ng-template" id="dShortText.html">
        <div class="form-input">
            <input ng-required="currentEntity.isRequired"
                   ng-model="context.currentPropValues[0].value"
                   placeholder="{{ 'platform.genericValueInput.placeholders.short-text' | translate}}">
        </div>
    </script>
    <script type="text/ng-template" id="dSecureString.html">
        <div class="form-input">
            <input ng-required="currentEntity.isRequired"
                   ng-model="context.currentPropValues[0].value"
                   type="password" placeholder="{{ 'platform.genericValueInput.placeholders.secure-string' | translate}}">
        </div>
    </script>
    <script type="text/ng-template" id="dUrl.html">
        <div class="form-input">
            <input ng-required="currentEntity.isRequired"
                   ng-model="context.currentPropValues[0].value"
                   type="url" placeholder="{{ 'platform.genericValueInput.placeholders.url' | translate}}">
        </div>
    </script>
    <script type="text/ng-template" id="dLongText.html">
        <div class="form-input">
            <textarea ng-required="currentEntity.isRequired"
                      ng-model="context.currentPropValues[0].value"
                      placeholder="{{ 'platform.genericValueInput.placeholders.long-text' | translate}}"></textarea>
        </div>
    </script>
    <script type="text/ng-template" id="dHtml.html">
        <div class="form-input">
            <ui-codemirror ng-required="currentEntity.isRequired"
                           ng-model="context.currentPropValues[0].value"
                           ui-codemirror-opts="editorOptions"></ui-codemirror>
        </div>
    </script>

    <script type="text/ng-template" id="dInteger.html">
        <div class="form-input __number">
            <input smart-float num-type="integer"
                   ng-required="currentEntity.isRequired"
                   ng-model="context.currentPropValues[0].value"
                   placeholder="{{ 'platform.genericValueInput.placeholders.integer' | translate}}" />
        </div>
    </script>

    <script type="text/ng-template" id="dDecimal.html">
        <div class="form-input __number">
            <input smart-float num-type="float"
                   ng-required="currentEntity.isRequired"
                   ng-model="context.currentPropValues[0].value"
                   placeholder="{{ 'platform.genericValueInput.placeholders.number' | translate}}" />
        </div>
    </script>

    <script type="text/ng-template" id="dDateTime.html">
        <div class="form-input __calendar">
            <input ng-model="context.currentPropValues[0].value"
                   datepicker-popup="{{currentEntity.isReadonly ? 'short' : '' }}"
                   ng-disabled="currentEntity.isReadonly"
                   is-open="datepickers.DateTime"
                   placeholder="{{ 'platform.genericValueInput.placeholders.date-time' | translate}}"
                   close-text="Close">
            <button ng-click="open($event, 'DateTime')" type="button" class="btn" ng-disabled="currentEntity.isReadonly">
                <i class="btn-ico fa fa-calendar"></i>
            </button>
        </div>
    </script>

    <script type="text/ng-template" id="dBoolean.html">
        <label class="form-label __switch">
            <input type="checkbox" ng-model="context.currentPropValues[0].value">
            <span class="switch"></span>
        </label>
    </script>

    <script type="text/ng-template" id="dShortText-multivalue.html">
        <tags-input ng-model="context.currentPropValues"
                    min-length="1"
                    min-tags="{{currentEntity.isRequired ? 1 : undefined}}"
                    add-on-blur="true"
                    display-property="value"
                    placeholder="{{ 'platform.genericValueInput.placeholders.short-text-multivalue' | translate}}">
        </tags-input>
    </script>
    <script type="text/ng-template" id="dInteger-multivalue.html">
        <tags-input ng-model="context.currentPropValues"
                    min-tags="{{currentEntity.isRequired ? 1 : undefined}}"
                    add-on-blur="true"
                    allowed-tags-pattern="^[-]?[0-9]*$"
                    min-length="1"
                    display-property="value"
                    placeholder="{{ 'platform.genericValueInput.placeholders.integer-multivalue' | translate}}">
        </tags-input>
    </script>
    <script type="text/ng-template" id="dDecimal-multivalue.html">
        <tags-input ng-model="context.currentPropValues"
                    min-tags="{{currentEntity.isRequired ? 1 : undefined}}"
                    add-on-blur="true"
                    allowed-tags-pattern="^[-]?[0-9]+[\.]?[0-9]*$"
                    min-length="1"
                    display-property="value"
                    placeholder="{{ 'platform.genericValueInput.placeholders.number-multivalue' | translate}}">
        </tags-input>
    </script>

    <script type="text/ng-template" id="dShortText-dictionary.html">
        <div class="form-input">
            <ui-select ng-model="context.currentPropValues[0]">
                <ui-select-match placeholder="{{ 'platform.genericValueInput.placeholders.short-text-dictionary' | translate}}">{{$select.selected.name}}</ui-select-match>
                <ui-select-choices repeat="propValue in context.allDictionaryValues | filter: {name: $select.search}">
                    <span ng-bind-html="propValue.name | highlight: $select.search"></span>
                </ui-select-choices>
            </ui-select>
        </div>
    </script>


    <script type="text/ng-template" id="dShortText-dictionary-multivalue.html">
        <div class="form-input">
            <ui-select multiple ng-model="context.currentPropValues">
                <ui-select-match placeholder="{{ 'platform.genericValueInput.placeholders.short-text-dictionary-multivalue' | translate}}">{{$item.name}}</ui-select-match>
                <ui-select-choices repeat="propValue in context.allDictionaryValues | filter: {name: $select.search}">
                    <span ng-bind-html="propValue.name | highlight: $select.search"></span>
                </ui-select-choices>
            </ui-select>
        </div>
    </script>

    <script type="text/ng-template" id="dShortText-multilang.html">
        <div class="form-input __langs" ng-repeat="propValue in context.currentPropValues | orderBy: 'locale'">
            <span class="flag flag-{{propValue.locale.substr(3).toLowerCase()}}"></span>
            <input ng-required="currentEntity.isRequired"
                   ng-model="propValue.value"
                   placeholder="{{ 'platform.genericValueInput.placeholders.short-text-multilang' | translate}}">
        </div>
    </script>
    <script type="text/ng-template" id="dLongText-multilang.html">
        <div class="form-input __langs" ng-repeat="propValue in context.currentPropValues | orderBy: 'locale'">
            <span class="flag flag-{{propValue.locale.substr(3).toLowerCase()}}"></span>
            <textarea ng-required="currentEntity.isRequired"
                      ng-model="propValue.value"
                      placeholder="{{ 'platform.genericValueInput.placeholders.long-text-multilang' | translate}}" />
        </div>
    </script>
    <script type="text/ng-template" id="dHtml-multilang.html">
        <div ng-class="{'form-group': !$first}" ng-repeat="propValue in context.currentPropValues | orderBy: 'locale'">
            <span class="flag flag-{{propValue.locale.substr(3).toLowerCase()}}"></span>
            <ui-codemirror ng-required="currentEntity.isRequired"
                           ng-model="propValue.value"
                           ui-codemirror-opts="editorOptions"></ui-codemirror>
        </div>
    </script>


    <script type="text/ng-template" id="dShortText-multivalue-multilang.html">
        <div class="form-input __langs" ng-repeat="propValue in context.currentPropValues | orderBy: 'locale'">
            <span class="flag flag-{{propValue.locale.substr(3).toLowerCase()}}"></span>
            <tags-input ng-model="propValue.values"
                        min-tags="{{currentEntity.isRequired ? 1 : undefined}}"
                        add-on-blur="true"
                        min-length="1"
                        display-property="value"
                        placeholder="{{ 'platform.genericValueInput.placeholders.short-text-multivalue-multilang' | translate}}">
            </tags-input>
        </div>
    </script>

    <script type="text/ng-template" id="dShortText-dictionary-multilang.html">
        <div class="form-input">
            <ui-select ng-model="context.currentPropValues[0]">
                <ui-select-match placeholder="{{ 'platform.genericValueInput.placeholders.short-text-dictionary-multilang' | translate}}">{{$select.selected.name}}</ui-select-match>
                <ui-select-choices repeat="propValue in context.allDictionaryValues | filter: {name: $select.search}">
                    <span ng-bind-html="propValue.name | highlight: $select.search"></span>
                </ui-select-choices>
            </ui-select>
        </div>
        <div ng-repeat="data in context.currentPropValues[0].displayNames | orderBy: 'locale'" style="margin:5px 0;">
            <span class="flag flag-{{data.locale.substr(3, 2).toLowerCase()}}"></span>
            {{data.name}}
        </div>
    </script>

    <script type="text/ng-template" id="dShortText-dictionary-multivalue-multilang.html">
        <div class="form-input">
            <ui-select multiple ng-model="context.currentPropValues">
                <ui-select-match placeholder="{{ 'platform.genericValueInput.placeholders.short-text-dictionary-multivalue-multilang' | translate}}">{{$item.name}}</ui-select-match>
                <ui-select-choices repeat="propValue in context.allDictionaryValues | filter: {name: $select.search}">
                    <span ng-bind-html="propValue.name | highlight: $select.search"></span>
                </ui-select-choices>
            </ui-select>
        </div>
    </script>
</div>